<template>
  <page-layout>
    <a-row :gutter="[10, 10]">
      <!-- 中心区域 -->
      <a-col :span="24">
        <a-card>
          <div class="mb-20">
            <!-- 查询参数 -->
            <pro-query
              :searchParam="state.searchParams"
              @on-search="search"
              @on-reset="reset"
              :colSpan="{
                label: 7,
                wrapper: 16
              }"
            ></pro-query>
          </div>
          <!-- 列表 -->
          <pro-table
            ref="tableRef"
            :pagination="pagination"
            :fetch="fetch"
            :columns="state.columns"
            :operate="state.operate"
            :param="state.param"
            :toolbar="toolbar"
            :row-selection="{
              selectedRowKeys: state.selectedRowKeys,
              onChange: onSelectChange,
            }"
          />
        </a-card>
      </a-col>
    </a-row>
    <importModal
      v-if="exportConfig.importVisible"
      :exportConfig="exportConfig"
      @handleModal="handleModal"
      :visible="exportConfig.importVisible"
      @close="closeImport"
    ></importModal>
    <BasicTableModal
      v-model:visible="modalConfig.visible"
      v-if="modalConfig.visible"
      :columns="modalConfig.columns"
      :fetchAjax="modalConfig.api"
      :searchParams="modalConfig.searchParams"
      :searchForm="modalConfig.searchForm"
      :title="modalConfig.title"
      @selectUniversity="
        value => selectItem(value)
      "
    />
  </page-layout>
</template>
<script>
export default {
  name: "curriculum-price"
}
</script>
<script setup>
import { message, Modal } from "ant-design-vue";
import { page, remove, removeBatch, imports, templateUrl } from "@/api/module/curriculum-price";
import { onMounted, reactive, ref } from "vue";
import { useRouter } from "vue-router";
import useTable from "@/controller/useTable";
import dictEnum from "@/const/dict";
import { getDictByCodesReturnObj } from "@/tools/get-dict";
import importModal from "@/component/import/index.vue";
import BasicTableModal from "@/component/basic-table-modal";
import { page as projectPage } from "@/api/module/project"; // 项目
import moment from 'moment'

const tableRef = ref(null);
const router = useRouter();

const goNewSchool = () => router.push("/university/curriculum-price/add");
const modalConfig = reactive({
  api: projectPage,
  type: "",
  title: '项目名称',
  visible: false,
  columns: [
    { dataIndex: "code", key: "code", title: "项目编码" },
    { dataIndex: "projectName", key: "projectName", title: "项目名称" },
    { dataIndex: "projectAddress", key: "projectAddress", title: "项目地址" },
    {
      dataIndex: "schName",
      key: "schName",
      title: "合作学校名称"
    }
  ],
  currentIndex: undefined,
  searchParams: {},
  searchForm: [
    { type: "input", key: "code", label: "项目编码" },
    { type: "input", key: "projectName", label: "项目名称" },
  ],
  callback: null,
})

const toolbar = [
  {
    code: "curriculum-price:add",
    label: "新增",
    type: "primary",
    event: (selectedRowKeys) => {
      goNewSchool();
    },
  },
  {
    code: "curriculum-price:removeBatch",
    label: "批量删除",
    type: "danger",
    event: (selectedRowKeys) => {
      if (state.selectedRowKeys && !state.selectedRowKeys.length) {
        return message.error("请先选择数据");
      }
      Modal.confirm({
        title: "你需要批量删除该学校数据吗？",
        okText: "是",
        okType: "danger",
        cancelText: "否",
        onOk() {
          removeBatch({ ids: [...state.selectedRowKeys] }).then((response) => {
            if (response.success) {
              message.success({ content: "删除成功" });
              tableRef.value.reload();
            } else {
              message.error({ content: response.msg });
            }
          });
        },
      });
    },
  },
  {
    code: "",
    label: "批量导入",
    type: "",
    event: () => {
      handleExport();
    },
  },
];
const handleExport = () => {
  exportConfig.importVisible = true;
};
const exportConfig = reactive({
  title: "课程班次",
  exportExcel: imports,
  templateUrl: templateUrl,
  downMethod: "GET",
  fileName: "课程班次导入模板",
  params: {},
  importVisible: false,
  check: true,
  holder: '项目名称'
});
const selectItem = (value) => {
  if (value) {
    exportConfig.check = false;
    exportConfig.params.code = value.code
    modalConfig.callback && modalConfig.callback({ name: value.projectName})
    modalConfig.visible = false
  }
}
const closeImport = (value) => {
  exportConfig[value] = false;
  exportConfig.params.code = '';
  modalConfig.callback = null
  exportConfig.check = true;
  tableRef.value.reload();
};
let dictLists = reactive({
  data: {},
});
const reset = () => {
  state.param = {}
  tableRef.value.reload()
}
const handleModal = (callback) => {
  modalConfig.callback = callback
  modalConfig.visible = true
}
const onSelectChange = (selectedRowKeys) => {
  state.selectedRowKeys = selectedRowKeys;
};
onMounted(async () => {
  dictLists.data = await getDictByCodesReturnObj([
    dictEnum.ENABLE,
    dictEnum.TIME_ZONE, // 学校时区
    dictEnum.COURSE_SHIFT_SHAPE, // 课程形式
    dictEnum.COURSE_TYPE, // 课程类型
    dictEnum.QUARTER, // 季度
  ]);
  state.searchParams = [
    {
      span: 8,
      key: "schoolYear",
      type: "input",
      label: "学年",
      placeholder: "请输入",
    },
    {
      span: 8,
      key: "quarter",
      type: "select",
      label: "季度",
      placeholder: "请输入",
      options: dictLists.data[dictEnum.QUARTER]
    },
    {
      span: 8,
      key: "schName",
      type: "input",
      label: "学校",
      placeholder: "请输入",
    },
    {
      span: 8,
      key: "disciplineName",
      type: "input",
      label: "学科类别",
      placeholder: "请输入",
      hidden: true,
    },
    {
      span: 8,
      key: "courseCode",
      type: "input",
      label: "课程代码",
      placeholder: "请输入",
      hidden: true,
    },
    {
      span: 8,
      key: "courseName",
      type: "input",
      label: "课程名称",
      placeholder: "请输入",
      hidden: true,
    },
    {
      span: 8,
      key: "typeId",
      type: "select",
      label: "课程类型",
      placeholder: "请输入",
      options: dictLists.data[dictEnum.COURSE_TYPE],
      hidden: true,
    },
    {
      span: 8,
      key: "shape",
      type: "select",
      label: "课程形式",
      placeholder: "请输入",
      options: dictLists.data[dictEnum.COURSE_SHIFT_SHAPE],
      hidden: true,
    },
    {
      span: 8,
      key: "duration",
      type: "input",
      label: "课程时长(周)",
      placeholder: "请输入",
      hidden: true,
    },
    {
      span: 8,
      key: "timeZone",
      type: "select",
      label: "学校时区",
      placeholder: "请输入",
      options: dictLists.data[dictEnum.TIME_ZONE],
      hidden: true,
    },
    {
      span: 8,
      key: "state",
      type: "select",
      label: "状态",
      placeholder: "请输入",
      options: dictLists.data[dictEnum.ENABLE],
      hidden: true,
    },
    {
      span: 8,
      key: "credit",
      type: "input",
      label: "学分",
      placeholder: "请输入",
      hidden: true,
    },
    // {
    //   span: 8,
    //   key: "projectName",
    //   type: "input",
    //   label: "项目名称",
    //   placeholder: "请输入",
    // },
    // {
    //   span: 8,
    //   key: "professorName",
    //   type: "input",
    //   label: "教授",
    //   placeholder: "请输入",
    // },
    // {
    //   span: 8,
    //   key: "taName",
    //   type: "input",
    //   label: "助教",
    //   placeholder: "请输入",
    // },
  ]
})
const { search, fetch, pagination, state } = useTable(
  page,
  [
    {
      dataIndex: "state",
      key: "state",
      title: "是否上架",
      width: 80,
      cellRender: (record, data) => {
        const obj = dictLists.data[dictEnum.ENABLE]
          ? dictLists.data[dictEnum.ENABLE].find(item => item.value == data)
          : null
        return obj ? obj.label : '';
      },
    },
    { dataIndex: "schoolYear", key: "schoolYear", title: "学年", width: 150 },
    { dataIndex: "quarter", key: "quarter", title: "季度", width: 150 , cellRender: (record, data) => {
        const obj = dictLists.data[dictEnum.QUARTER]
            ? dictLists.data[dictEnum.QUARTER].find(item => item.value == data)
            : null
        return obj ? obj.label : '';
      },
    },
    { dataIndex: "schName", key: "schName", title: "项目学校", width: 150 },
    { dataIndex: "disciplineName", key: "disciplineName", title: "学科类别", width: 150 },
    { dataIndex: "courseCode", key: "courseCode", title: "课程代码", width: 150 },
    { dataIndex: "courseName", key: "courseName", title: "课程名称", width: 150 },
    { dataIndex: "typeId", key: "typeId", title: "课程类型", width: 150 , cellRender: (record, data) => {
  const obj = dictLists.data[dictEnum.COURSE_TYPE]
      ? dictLists.data[dictEnum.COURSE_TYPE].find(item => item.value == data)
      : null
  return obj ? obj.label : '';
},},
    { dataIndex: "credit", key: "credit", title: "学分", width: 150 },
    { dataIndex: "schShiftCode", key: "schShiftCode", title: "学校班级代码", width: 150 },
    { dataIndex: "duration", key: "duration", title: "课程时长（周）", width: 150 },
    { dataIndex: "timeZone", key: "timeZone", title: "学校时区", width: 150, cellRender: (record, data) => {
        const obj = dictLists.data[dictEnum.TIME_ZONE]
            ? dictLists.data[dictEnum.TIME_ZONE].find(item => item.value == data)
            : null
        return obj ? obj.label : ''; } },
    { dataIndex: "startTime", key: "startTime", title: "开始日期", width: 150 , cellRender: (record, data) => {
        if (data) {
          return moment(data).format('YYYY-MM-DD')
        }
      } },
    { dataIndex: "endTime", key: "endTime", title: "结束日期", width: 150 , cellRender: (record, data) => {
        if (data) {
          return moment(data).format('YYYY-MM-DD')
        }
      } },
    { dataIndex: "courseHours", key: "courseHours", title: "上课时间", width: 150 },
    { dataIndex: "price", key: "price", title: "价格", width: 150 },
    { dataIndex: "startRegisterTime", key: "startRegisterTime", title: "开始注册日期", width: 150 , cellRender: (record, data) => {
        if (data) {
          return moment(data).format('YYYY-MM-DD')
        }
      } },
    { dataIndex: "endRegisterTime", key: "endRegisterTime", title: "结束注册日期", width: 150 , cellRender: (record, data) => {
        if (data) {
          return moment(data).format('YYYY-MM-DD')
        }
      } },
  ],
  [
    {
      label: "详情",
      event: (item) =>
        router.push({
          path: "/university/curriculum-price/detail",
          query: { id: item.id },
        }),
    },
    {
      code: 'curriculum-price:remove',
      label: "删除",
      event: (item) => {
        Modal.confirm({
          title: "删除",
          content: "是否删除课程班次？",
          okText: "是",
          okType: "danger",
          cancelText: "否",
          onOk() {
            remove({ id: item.id }).then((res) => {
              if (res.code === 500) return message.error("删除失败");
              message.success("删除成功");
              tableRef.value.fetch({ current: 1 });
            });
          },
        });
      },
    },
  ],
  []
);

</script>
